<template>
  <div class="wait-pay">
    <div class="wait-pay-title border-bottom">
      <p class="left iconfont">&#xe624;</p>
      <p class="right">订单详情</p>
    </div>

    <div class="pay-time">
      <p class="top">剩余付款时间</p>
      <p class="bottom">13:23</p>
    </div>

     <div class="address">
       
      <p class="top">
        <img src="~assets/images/profile/电话@2x.png" alt="">
        <span> 张三 &nbsp; &nbsp; &nbsp; &nbsp;14583925811</span>
      </p>
      <p class="bottom">
        <img src="~assets/images/profile/图层47@2x.png" alt="">
        <span>浙江省杭州市江干区酱酱大道213号酿酿小区</span>
      </p>
    </div>

  </div>

</template>

<script>
import Header from './header'
export default {
  name: 'waitPay'
}
</script>

<style lang="less" scoped>
.wait-pay {
  height: 100vh;
  background: #eee;
  .wait-pay-title {
    height: .445rem;
    display: flex;
    background: #fff;
    font-size: .18rem;
    align-items: center;
    color: #333;
    .left {
      margin-left: .15rem;
    }
    .right {
      margin-left: 1.27rem;
    }
  }
  .pay-time {
    height: .44rem;
    font-size: .14rem;
    color: #333;
    display: flex;
    align-items: center;
    background: #fff;
    margin-top: .1rem;
    .top {
      margin-left: .155rem;
    }
    .bottom {
      color: #D20A0A;
      margin-left: .155rem;
    }
  }
  .address {
     height: .69rem;
     font-size: .14rem;
     display: flex;
     flex-direction: column;
     margin-top: .1rem;
     justify-content: space-evenly;
     background: #fff;
     padding-left: .15rem;
    .top {
     color: #333;
     img {
       display: inline-block;
       width: .145rem;
       height: .145rem;
     }
    }
    .bottom {
      color: #666;
      img {
        display: inline-block;
        width: .145rem;
        height: .175rem;
      }
    }
  }
}
</style>